<template>
    <h2>排房信息详情页</h2>
    <table class="table" border="1">
        
       <tr>
         <td colspan="2">
            <h4>房型信息</h4></td>
       </tr>
       <tr>
            <td>房型图片</td>
            <td>
                <img :src="Rtinfo.rtImgurl" alt="" style="width: 60px;height: 60px;"/>
            </td>
        </tr>
        <tr>
            <td>房型名称</td>
            <td>
                {{ Rtinfo.rtName }}
            </td>
        </tr>
        <tr>
            <td>房型面积</td>
            <td>
               {{ Rtinfo.rtSize }}
            </td>
        </tr>
        <tr>
            <td>房型价格</td>
            <td>
               {{ Rtinfo.rtPrice }}
            </td>
        </tr>
        <tr>
            <td>可住人数</td>
            <td>
               {{ Rtinfo.rtPersonnum }}
            </td>
        </tr>
        <tr>
         <td colspan="2">
            <h4>房号信息</h4></td>
       </tr>
       <tr>
         <td>选择房号</td>
         <td>
            <select v-model="info.rnId">
                <option :value="0">==请选择==</option>
                <option v-for="item in Rninfo" :value="item.rnId">{{ item.rnRoomnum }}</option>
            </select>
         </td>
       </tr>
        <tr>
            <td></td>
            <td>
                
                <input  type="button" value="返回"  @click="fanhui" />
            </td>
        </tr>
    </table>
</template>
<script setup lang="ts">
 import { ref,onMounted } from 'vue';
 import axios from 'axios';
 import { useRoute,useRouter } from 'vue-router';

 onMounted(()=>{

    Fantianall();
    Numft();
    
 })

const route=useRoute();
const router=useRouter();
 const info=ref({
    "ntId": 0,
    "rnId": 0,
    "rtId": 0,
    "delluoji": true
 })

const Fantianall=()=>{
    axios.get("https://localhost:7010/api/RoomNumType/GettypenumBuID?id="+route.params.id)
    .then(res=>{
        info.value=res.data;
        Fantian();
       
    })
}

const Rtinfo=ref({
    "rtId": 1,
  "rtName": "",
  "rtSize": 0,
  "rtPrice": 0,
  "rtImgurl": "",
  "rtPersonnum": 0,
  "rtInfo": ""
})


const Fantian=()=>{
    axios.get("https://localhost:7010/api/RoomNumType/GetRoomTypeById?id="+info.value.rtId)
    .then(res=>{
        Rtinfo.value=res.data;
        info.value.rtId=Rtinfo.value.rtId;
    })
}

const Rninfo=ref([{
    "rnId": 1,
    "beizhu": "",
    "rnRoomnum": 0,
    "rnCreatetime": "",
    "rnState": true,
    "rnDel": true
}])

const Numft=()=>{
    axios.get("https://localhost:7010/api/RoomNum/GetRoomNums")
    .then(res=>{
        Rninfo.value=res.data;
        
    })
}

const fanhui=()=>{
    router.push("Show");
}
</script>